import React, { Component } from 'react';
/* 
    子传父
    1.
*/
class Dome extends Component{
  state ={
    msg:"🍉"
  }
/* 4.定义子组件执行父组件方法函数 */
  handleClick = (params) => {
    /* 5.执行父组件中的点击函数 */
    /* vue: => this.$emit("eventype",[]) */
    /*  小程序 => this.trigger("eventype",[]) */
    this.props.handleClick(this.state.msg)
  }
  render(){
    return <div>
      <h1>Dome组件</h1>
      <h1>{this.state.msg}</h1>
      {/* 3.子组件定义一个方法执行函数 */}
      <button onClick={this.handleClick}>点击给父组件传值</button>
    </div>
  }
}

class App extends Component {
  /* 1.定义父组件的方法 */
  handleParentClick =(params) => {
    console.log("调用父传就方法:",params)
  this.setState({
    title:params
  })
  }
  state={
    title:""
  }
  render() {
    return (
      <div>
        {/* 2.方法通过属性方式传给子组件 */}
        <Dome handleClick={this.handleParentClick}></Dome>
      <h1>子组件传父组件变量:{this.state.title}</h1>
      </div>
     
    
    );
  }
}

export default App;
